<template>
	<view>
<!--		<view class="tab-fixed u-m-20 u-p-20 u-flex u-row-around u-col-center">-->
<!--			<view class="tab-item u-flex u-row-center u-col-center" :class="is_choose==0?'active':''" @click="ontab(0)">视频课</view>-->
<!--			<view class="tab-item u-flex u-row-center u-col-center" :class="is_choose==1?'active':''" @click="ontab(1)">音频课</view>-->
<!--&lt;!&ndash;			<view class="tab-item u-flex u-row-center u-col-center" :class="is_choose==2?'active':''" @click="ontab(2)">价值文档</view>&ndash;&gt;-->
<!--		</view>-->
		<view class="content u-p-l-20 u-p-r-20">
			<view class="group-fac u-flex u-row-between u-col-center" v-for="(item,index) in classData" :key="index" @click="jump('/pages/finance/companyDetail',{val:item.id})">
				<view class="leftgroup u-flex u-row-between u-col-center">
					<image class="left-img" :src="item.is_buy=='0'?($IMG_URL + '/user/shoucang/weigoumai.png'):($IMG_URL + '/static/images/user/shoucang/yigoumai.png')"></image>
					<view class="left-title">{{ item.course.title }}</view>
				</view>
				<view class="right-content u-flex u-row-between u-col-center">
					<u-icon name="star-fill" class="right-start" :color="item.type=='1'?'#E9841F':'#F0F0F0'" size="34"></u-icon>
					<view class="right" v-if="item.is_buy=='1'">
						已购买
					</view>
					<image class="right right-img" :src="$IMG_URL + '/user/shoucang/lock.png'" v-if="item.is_buy=='0'">
					</image>
				</view>
			</view>
		</view>
		<u-loadmore :status="loadingType" margin-top="20"></u-loadmore>
	</view>
	
</template>

<script>
export default {
	data() {
		return {
			is_choose:0,
			page: 1, //分页加载
			loadingType: 'more', //加载更多状态
			classData:[]
		};
	},
	onLoad(){
		console.log("====123")
		this.getMycourse("refresh")
	},
	methods:{
		jump(path, parmas) {
			this.$Router.push({
				path: path,
				query: parmas
			});
		},
		ontab(index){
			this.is_choose = index
		},
		
		getMycourse(type = 'add', loading) {
			if (type === 'add') {
				if (this.loadingType === 'nomore') {
					return;
				}
				this.loadingType = 'loading';
			} else if (type === 'refresh') {
				this.loadingType = 'loading';
				this.page = 1;
				this.classData = [];
			} else {
				this.loadingType = 'more';
			}
			
			let formData = {
				page: this.page,
				token: uni.getStorageSync('token')
			};
			this.$new_http('newuser.mycourse', formData).then(res => {
				let projectList = res.data.data;
				this.page++;
				this.classData = this.classData.concat(projectList);
				this.loadingType = res.data.current_page >= res.data.last_page ? 'nomore' : 'more';
			});
		}
	},
	//加载更多
	onReachBottom() {
		this.getMycourse();
	}
}
</script>

<style lang="scss">
page{
	background: #FBFAFA;
}
.tab-fixed{
	position: fixed;
	top: 0px;
	width: 95%;
	padding-top: 10rpx!important;
	padding-bottom: 10rpx!important;
	background:#FBFAFA;
	z-index: 1000;
	.tab-item{
		width: 33%;
		position:relative;
		&.active{
			color: #ED861F;
		}
		&.active::after{
			content: "";
			position:absolute;
			bottom: -20rpx;
			width: 30rpx;
			height: 8rpx;
			border-radius: 8rpx;
			background: #ED861F;
		}
	}
}
.content{
	background: #fff;
	border-radius: 20rpx;
	//margin-top: 116rpx;
	.group-fac{
		border-bottom:2rpx solid #F0F0F0 ;
		margin: 0 30rpx;
		padding: 30rpx 0rpx;
		width: 93%;
		.leftgroup{
			.left-img{
				width: 40rpx;
				height: 40rpx;
				margin-right: 20rpx;
			}
		}
		.right-content{
			width: 22%;
			.right{
				width: 50%;
				display: flex;
				justify-content: space-between;
				align-items: center;
				font-size: 24rpx;
				color:#999;
			}
			.right-img{
				width:22rpx;
				height: 30rpx;
				margin-right: 20rpx;
			}
		}
		
	}
}

</style>
